<template>
    <div class="scroll-container" @scroll="handleScroll">
        <div class="content">
            <p v-for="n in 50" :key="n">hhh {{ n }}</p>
        </div>
    </div>
</template>

<script>
export default {
    name: "ListenerView",
    data() {
        return {
            isScrolling: false,
            lastScrollTime: 0,
            scrollThreshold: 100,
        };
    },
    methods: {
        handleScroll(event) {
            const currentTime = Date.now();
            if (currentTime - this.lastScrollTime < this.scrollThreshold) {
                this.isScrolling = true;
            } else {
                this.isScrolling = false;
            }
            this.lastScrollTime = currentTime;
            console.log("状态：", this.isScrolling);
        },
    },
};
</script>
  
<style scoped>
.scroll-container {
    width: 300px;
    height: 200px;
    overflow-y: auto;
    border: 1px solid #ccc;
    margin: 20px auto;
}

.content p {
    padding: 10px;
    border-bottom: 1px solid #eee;
}
</style>
  